<!doctype html>  
<!--[if IE 6 ]><html lang="en-us" class="ie6"> <![endif]-->
<!--[if IE 7 ]><html lang="en-us" class="ie7"> <![endif]-->
<!--[if IE 8 ]><html lang="en-us" class="ie8"> <![endif]-->
<!--[if (gt IE 7)|!(IE)]><!-->
<html lang="en-us"><!--<![endif]-->
<head>
	<meta charset="utf-8">
	
	<title>Nevia - Responsive HTML5 Template</title>
	
	<meta name="description" content="Thank you for your purchase! If you have any questions that you feel should have been in this document, please log in using the account used to purchase the file and email via my user page contact form here. Thanks so much!

For questions on basic HTML, JavaScript or CSS editing - please give your question a quick Google or visit W3Schools as theme issues get top priority. You will need some knowledge of HTML/CSS to edit this theme. ">
	<meta name="author" content="Vasterad">
	<meta name="copyright" content="Vasterad">
	<meta name="generator" content="Documenter v1.6 http://rxa.li/documenter">
	<meta name="date" content="2012-12-29T22:18:14+01:00">
	
	<link rel="stylesheet" href="css/documenter_style.css" media="all">
	
	
	<script src="js/jquery.1.6.4.js"></script>
	
	<script src="js/jquery.scrollTo-1.4.2-min.js"></script>
	<script src="js/jquery.easing.js"></script>
	
	<link rel="stylesheet" href="css/shDocumenter.css" media="screen">
	<script src="js/shCore.js"></script>
	<script src="js/shBrushPlain.js"></script>
	<script>SyntaxHighlighter.defaults['toolbar'] = false;SyntaxHighlighter.all();</script>

	<script>document.createElement('section');var duration=500,easing='swing';</script>
	<script src="js/script.js"></script>
	
	<style>
		html{background-color:#EEEEEE;color:#383838;}
		::-moz-selection{background:#383838;color:#FFFFFF;}
		::selection{background:#383838;color:#FFFFFF;}
		#documenter_sidebar #documenter_logo{background-image:url(assets/images/image_1.png);}
		a{color:#169FE6;}
		hr{border-top:1px solid #D4D4D4;border-bottom:1px solid #FFFFFF;}
		#documenter_sidebar, #documenter_sidebar ol a{background-color:#404040;color:#FFFFFF;}
		#documenter_sidebar ol a{-webkit-text-shadow:1px 1px 0px #4F4F4F;-moz-text-shadow:1px 1px 0px #4F4F4F;text-shadow:1px 1px 0px #4F4F4F;}
		#documenter_sidebar ol{border-top:1px solid #292929;}
		#documenter_sidebar ol a{border-top:1px solid #4F4F4F;border-bottom:1px solid #292929;color:#FFFFFF;}
		#documenter_sidebar ol a:hover{background:#383838;color:#FFFFFF;border-top:1px solid #383838;}
		#documenter_sidebar ol a.current{background:#383838;color:#FFFFFF;border-top:1px solid #383838;}
		#documenter_copyright{display:block !important;visibility:visible !important;}
	</style>
	
</head>
<body>
	<div id="documenter_sidebar">
		<a href="#documenter_cover" id="documenter_logo"></a>
		<ol id="documenter_nav">
			<li><a class="current" href="#documenter_cover">Start</a></li>
			<li><a href="#helpful_tips">Helpful Tips</a></li>
			<li><a href="#html_structure">HTML Structure</a></li>
			<li><a href="#css_structure">CSS Structure</a></li>
			<li><a href="#layerslider">LayerSlider</a>
				<ol>
					<li><a href="#layerslider_html_markup">HTML Markup</a>
					<li><a href="#layerslider_positioning_sublayers">Positioning sublayers</a>
					<li><a href="#layerslider_embedding_videos_youtube_and_vimeo_">Embedding Videos (YouTube and Vimeo)</a>
				</ol>
			</li>
			<li><a href="#icon_usage">Icon Usage</a></li>
			<li><a href="#style_switcher">Style Switcher</a></li>
			<li><a href="#portfolio_filtering">Portfolio Filtering</a></li>
			<li><a href="#contact_form">Contact Form</a></li>
			<li><a href="#twitter_flickr">Twitter & Flickr</a></li>
			<li><a href="#javascript">JavaScript</a></li>
			<li><a href="#sources_credits">Sources & Credits</a></li>

		</ol>
		<div id="documenter_copyright">Copyright Vasterad 2012<br>
		made with the <a href="http://rxa.li/documenter">Documenter v1.6</a> 
		</div>
	</div>
	<div id="documenter_content">
	<section id="documenter_cover"><h1>Nevia</h1><h2>Responsive HTML5 Template</h2><hr><ul><li>By: Vasterad</li><li><a href="http://themeforest.net/user/Vasterad/">themeforest.net/user/Vasterad/</a></li></ul><p>Thank you for your purchase! If you have any questions that you feel should have been in this document, please log in using the account used to purchase the file and email via my user page contact form here. Thanks so much!
<br/><br/>
For questions on basic HTML, JavaScript or CSS editing - please give your question a quick Google or visit W3Schools as theme issues get top priority. You will need some knowledge of HTML/CSS to edit this theme. </p></section><section id="helpful_tips">
	<h3>Helpful Tips</h3><hr class="notop">
<p class="info" style="width: 600px;">
	Do not start from scratch, use an existing page I have created and modify it to learn how it works</p>
<p class="info" style="width: 600px;">
	Quickly find what you&#39;re looking for in this document by using your browser&#39;s &quot;Find in Page&quot; feature, typically Control+F.</p>
<p class="info" style="width: 600px;">
	Trying to locate/replace text, styles or code in themes? &quot;Find in Files&quot; command which is commonly found in any decent text editor which will save you hours of searching</p>
<p class="info" style="width: 600px;">
	Getting an error message, chances are someone else has seen it too, try a google search for a quick fix.</p>
<p class="info" style="width: 600px;">
	Many times plugins are to blame when a site fails, always try disabling any third-party plugins if you encounter an error you can&#39;t solve.</p>
<p class="info" style="width: 600px;">
	<strong>Don&#39;t forget to re-explore the live demo for layouts, usage ideas and sample code</strong></p>
</section>
<section id="html_structure">
	<h3>HTML Structure</h3><hr class="notop">
<p>
	Nevia template is based on <a href="http://getskeleton.com/">Skeleton</a> - a small collection of CSS &amp; JS by <small><a href="http://www.davegamache.com">Dave Gamache</a></small> files that can help you rapidly develop sites that look beautiful at any size, be it a 17&quot; laptop screen or an iPhone.</p>
<p>
	Skeleton&#39;s base grid is a variation of the 960 grid system. The syntax is simple and it&#39;s effective cross browser, but the awesome part is that it also has the flexibility to go mobile like a champ. You can really easily customize all part of site or build new.</p>
<p>
	&nbsp;</p>
<h5>
	<strong>1. Firstly add 960 container</strong></h5>
<pre>
    &lt;!-- 960 Container --&gt;
    &lt;div class=&quot;container&quot;&gt;&lt;/div&gt;
&nbsp;&nbsp; &nbsp;&lt;!-- End 960 Container --&gt;
</pre>
<h5>
	<strong>2. Secondly add a few columns from one to sixteen (that&#39;s max columns)</strong></h5>
<pre>
    &lt;!-- 960 Container --&gt;
    &lt;div class=&quot;container&quot;&gt;
         &lt;div class=&quot;eight columns&quot;&gt;1/2 Column - Content Here&lt;/div&gt;
         &lt;div class=&quot;eight columns&quot;&gt;1/2 Column - Content Here&lt;/div&gt;
    &lt;/div&gt;
&nbsp;&nbsp; &nbsp;&lt;!-- End 960 Container --&gt;

</pre>
<p>
	I&#39;ve added some examples - check bottom of the &quot;elements.html&quot; file. That&#39;ll help you a lot.</p>
<h5>
	<strong>3. Floated Grid</strong></h5>
<p>
	Skeleton base grid was modified and adapted to Nevia and has extra columns floated to the right or left edge of the wrapper. If you wan&#39;t to use it please follow &quot;right-sidebar.html&quot; or &quot;left-sidebar.html&quot; file. The best way to use it&#39;s page with floated sidebar (like blog or examples above).</p>
<pre>
    &lt;!-- 960 Container --&gt;
    &lt;div class=&quot;container floated&quot;&gt;
         &lt;div class=&quot;eleven floated&quot;&gt;Content&lt;/div&gt;
         &lt;div class=&quot;four floated sidebar left&quot;&gt;Sidebar&lt;/div&gt;
    &lt;/div&gt;
&nbsp;&nbsp; &nbsp;&lt;!-- End 960 Container --&gt;
</pre>
<p>
	&nbsp;</p>
</section>
<section id="css_structure">
	<h3>CSS Structure</h3><hr class="notop">
<p>
	I used four CSS files in this template (all styles&#39;re imported in main file of CSS - style.css).&nbsp;By using of them, we can work round this. Those files also contains some general styling, such as anchor tag colors, font-sizes, etc. Keep in mind, that these values might be overridden somewhere else in the files below:</p>
<ol>
	<li>
		<strong>styles.css</strong> - main css file + media query layouts;</li>
	<li>
		<strong>base.css</strong> - contains the basic styles like reset, typography;</li>
	<li>
		<strong>responsive.css</strong>&nbsp; - responsive grid;</li>
	<li>
		<strong>icons.css</strong>&nbsp; - font awesome icons and glyphicons halflings styles;</li>
</ol>
<p>
	The CSS files are separated into sections using:</p>
<pre>
/* =================================================================== */
/* Section
====================================================================== */

/* Sub Section
====================================*

</pre>
<p>
	&nbsp;</p>
</section>
<section id="layerslider">
	<h3>LayerSlider</h3><hr class="notop">
<h4 id="layerslider_html_markup">HTML Markup</h4>
<pre>
&lt;div id=&quot;slider&quot; style=&quot;width: 1020px; height: 450px;&quot;&gt;

    &lt;div class=&quot;ls-layer&quot;&gt;
        &lt;img class=&quot;ls-s1&quot; src=&quot;..&quot; alt=&quot;layer1-sublayer1&quot;&gt;
        &lt;img class=&quot;ls-s2&quot; src=&quot;..&quot; alt=&quot;layer1-sublayer2&quot;&gt;
        &lt;img class=&quot;ls-s3&quot; src=&quot;..&quot; alt=&quot;layer1-sublayer3&quot;&gt;
    &lt;/div&gt;

    ... other slides ...

&lt;/div&gt;
</pre>
<p>
	It is important do define the width and height of your slider!</p>
<p>
	As you can see, we created two layers with adding <span class="hl">class</span> named <span class="hl">ls-layer</span> to the divs - in this case the slideshow will have only two complete screens. We also put sublayers into layers - these are images, but you can use any type of content you want, including HTML code, or Flash movies too.</p>
<p>
	There are a special sublayer, it is called background and it has a <span class="hl">class</span> named <span class="hl">ls-bg</span>. The parallax-effect does not apply to background sublayers - so they are always staying in the background of the parent layer. (Otherwise you can add background-images to layers too.)</p>
<p>
	Other sublayers have a <span class="hl">class</span> named <span class="hl">ls-s</span><span class="i">number</span>. This number is a positive integer and it is important because of the parallax effect: sublayers with higher number will animate faster and therefore it seems that you see the whole animation in 3D. So the class name of a sublayer is one of the most important setting of the parallax effect. Sublayers with all the same properties BUT different number in their class names will animate with different speeds. For example a sublayer with class=&quot;ls-s4&quot; will animate faster than other sublayer with class=&quot;ls-s2&quot;.</p>
<p>
	Obviously you can create unlimited sublayers and they can have the same <span class="hl">class</span> too.</p>
<h4 id="layerslider_positioning_sublayers">Positioning sublayers</h4>
<p>
	There are some important things that you have to keep if you want your slider to work properly.</p>
<ul>
	<li>
		All sublayers are absolute positioned inside the layer</li>
	<li>
		You can use relative or static positioning INSIDE a sublayer</li>
	<li>
		You HAVE TO add the positions of your sublayers with a style tag. Please DO NOT use CSS file!</li>
	<li>
		You can use only left and top properties for positioning. Please DO NOT use right and bottom properties!</li>
	<li>
		You don&#39;t have to to add left or top properties if you don&#39;t want. The default values are 0px;</li>
	<li>
		You can use percentage values if you want. Note that percentage positioning works differently in LayerSlider, the plugin will position the sublayer into the center point to the specified position, so for example 50% means that the center of the sublayer will be exactly in the center of the layer.</li>
	<li>
		You cannot use margins on sublayers, but you can use borders or paddings.</li>
	<li>
		Please DO NOT add any style properties to ls-bg classed background sublayers.</li>
</ul>
<pre>
&lt;div id=&quot;slider&quot; style=&quot;width: 1020px; height: 450px;&quot;&gt;

    &lt;div class=&quot;ls-layer&quot;&gt;
        &lt;img class=&quot;ls-s1&quot; style=&quot;left: 20px; top: 200px;&quot; src=&quot;..&quot; alt=&quot;layer1-sublayer1&quot;&gt;
        &lt;img class=&quot;ls-s2&quot; style=&quot;left: 100px; top: 30px;&quot; src=&quot;..&quot; alt=&quot;layer1-sublayer2&quot;&gt;
        &lt;img class=&quot;ls-s3&quot; style=&quot;left: 50%; top:50%;&quot; src=&quot;..&quot; alt=&quot;layer1-sublayer3&quot;&gt;
    &lt;/div&gt;

    ... other slides ...

&lt;/div&gt;
</pre>
<p>
	&nbsp;</p>
<h4 id="layerslider_embedding_videos_youtube_and_vimeo_">Embedding Videos (YouTube and Vimeo)</h4>
<p>
	We want to show an example how to create a layer with an embedded video sublayer. LayerSlider works with embed codes of many video sharing websites, but we created some features to improve the work with two most popular sites: YouTube and Vimeo.</p>
<h6>
	<strong>So, how to put your video into a layer?</strong></h6>
<p>
	It is very simple: you will need to create a DIV sublayer and put your video embed code into. That&#39;s it! You can see in the following example, that we created a slider with two layers and we put a YouTube video into a sublayer of the first layer, and put a Vimeo video into a sublayer of the second layer.</p>
<pre>
  &lt;div id=&quot;slider&quot;&gt;

    &lt;div class=&quot;ls-layer&quot;&gt;
        &lt;img class=&quot;ls-bg&quot; src=&quot;..&quot; alt=&quot;layer1-background&quot;&gt;
        &lt;div class=&quot;ls-s2&quot;&gt;
            &lt;iframe width=&quot;640&quot; height=&quot;360&quot; src=&quot;http://www.youtube.com/embed/MT_r7Nw14EA&quot; frameborder=&quot;0&quot; allowfullscreen&gt;&lt;/iframe&gt;
        &lt;/div&gt;
    &lt;/div&gt;

    &lt;div class=&quot;ls-layer&quot;&gt;
        &lt;img class=&quot;ls-bg&quot; src=&quot;..&quot; alt=&quot;layer2-background&quot;&gt;
        &lt;div class=&quot;ls-s2&quot;&gt;
            &lt;iframe src=&quot;http://player.vimeo.com/video/24535181?color=ff9933&quot; width=&quot;873&quot; height=&quot;491&quot; frameborder=&quot;0&quot; webkitAllowFullScreen mozallowfullscreen allowFullScreen&gt;&lt;/iframe&gt;
        &lt;/div&gt;
    &lt;/div&gt;

&lt;/div&gt;
</pre>
<p>
	Important things about embedding:</p>
<ul>
	<li>
		You can position the video by adding style tag to the container DIV sublayer</li>
	<li>
		The dimensions of the video will be always the same as you define in the embed code with width and height properties</li>
	<li>
		You can create a full size video by adding the same width and height property to the iframe embed code as your slider&#39;s width and height</li>
</ul>
</section>
<section id="icon_usage">
	<h3>Icon Usage</h3><hr class="notop">
<h5>
	<strong>1. Font Awesome</strong></h5>
<p>
	Font Awesome is a @font-face iconset so you can change size and color of these icons by CSS.</p>
<p>
	If you need more informations, please visit this site: <a href="http://fortawesome.github.com/Font-Awesome/">http://fortawesome.github.com/Font-Awesome/</a></p>
<pre>
<span>&lt;!-- Standard Icon --&gt;
</span><span>&lt;<span class="start-tag">i</span> <span class="attribute-name">class</span>=&quot;<a class="attribute-value">icon-home</a>&quot;&gt;</span><span>&lt;/<span class="end-tag">i</span>&gt;</span>

<span>&lt;!-- White Icon --&gt;
</span><span>&lt;<span class="start-tag">i</span> <span class="attribute-name">class</span>=&quot;<a class="attribute-value">icon-home white</a>&quot;&gt;</span><span>&lt;/<span class="end-tag">i</span>&gt;</span>
</pre>
<h5>
	<strong>2. Glyphicons Halflings</strong></h5>
<p>
	Glyphicons is a library of precisely prepared monochromatic icons and symbols, created with an emphasis on simplicity and easy orientation.</p>
<p>
	If you need more informations, please visit this site: <a href="http://glyphicons.com/">http://glyphicons.com/</a></p>
<pre>
<span>&lt;!-- Standard Icon --&gt;</span>
<span>&lt;<span class="start-tag">i</span> <span class="attribute-name">class</span>=&quot;<a class="attribute-value">halflings file</a>&quot;&gt;</span><span>&lt;/<span class="end-tag">i</span>&gt;</span>

<span>&lt;!-- White Icon --&gt;
</span><span>&lt;<span class="start-tag">i</span> <span class="attribute-name">class</span>=&quot;<a class="attribute-value">halflings white file</a>&quot;&gt;</span><span>&lt;/<span class="end-tag">i</span>&gt;</span>
</pre>
<p>
	&nbsp;</p>
</section>
<section id="style_switcher">
	<h3>Style Switcher</h3><hr class="notop">
<h5>
	<strong>1. Main Color</strong></h5>
<p>
	You can use one of predefinied colors or build custom CSS with color which you want.</p>
<pre class="brush: plain">
&lt;link rel=&quot;stylesheet&quot; href=&quot;css/colors/blue.css&quot; id=&quot;colors&quot;&gt;
</pre>
<h5>
	<strong>2. Menu Style</strong></h5>
<p>
	To change menu&#39;s style set proper class for &lt;nav&gt; tag:</p>
<pre>
&lt;!-- Menu With Shadows --&gt;
&lt;nav id=&quot;navigation&quot; class=&quot;style-1&quot;&gt;

&lt;!-- Menu Without Shadows --&gt;
&lt;nav id=&quot;navigation&quot; class=&quot;style-2&quot;&gt;
</pre>
<h5>
	<strong>3. Background Image</strong></h5>
<p>
	If you want to use other than standard pattern, open &quot;base.css&quot; and modify on line 50 source to pattern.</p>
</section>
<section id="portfolio_filtering">
	<h3>Portfolio Filtering</h3><hr class="notop">
<h5 id="portfolio_filter_39s_buttons">
	<strong>Filters</strong></h5>
<p>
	To add new or modify current categories change <strong>data-option-value</strong> attribute to category which you want.</p>
<pre>
&lt;!-- Filters --&gt;
&lt;div id=&quot;filters&quot;&gt;
  &lt;ul class=&quot;option-set&quot; data-option-key=&quot;filter&quot;&gt;
     &lt;li&gt;&lt;a href=&quot;#filter&quot; class=&quot;selected&quot; data-option-value=&quot;*&quot;&gt;All&lt;/a&gt;&lt;/li&gt;
     &lt;li&gt;&lt;a href=&quot;#filter&quot; data-option-value=&quot;.example-a&quot;&gt;Example A&lt;/a&gt;&lt;/li&gt;
     &lt;li&gt;&lt;a href=&quot;#filter&quot; data-option-value=&quot;.example-b&quot;&gt;Example B&lt;/a&gt;&lt;/li&gt;
   &lt;/ul&gt;
&lt;/div&gt;
</pre>
<h5 id="portfolio_project_39s_thumbnails">
	<strong>Thumbnails</strong></h5>
<p>
	To connect filter button with project add to first div&#39;s class name of your category (in example below: <strong>sample-a</strong>). You can add there categories how many you want (use spaces between classes).</p>
<pre>
&lt;div class=&quot;eight columns portfolio-item <strong>example-a</strong>&quot;&gt;
  &lt;div class=&quot;item-img&quot;&gt;&lt;a href=&quot;project.html&quot;&gt;&lt;img src=&quot;images/project_01.jpg&quot; alt=&quot;&quot;/&gt;&lt;div class=&quot;overlay zoom&quot;&gt;&lt;/div&gt;&lt;/a&gt;&lt;/div&gt;
     &lt;div class=&quot;portfolio-item-meta&quot;&gt;
     &lt;h4&gt;&lt;a href=&quot;single_project.html&quot;&gt;Project&#39;s Title&lt;/a&gt;&lt;/h4&gt;
     &lt;p&gt;Project&#39;s Description.&lt;/p&gt;
  &lt;/div&gt;
&lt;/div&gt;

</pre>
<p>
	&nbsp;</p>
</section>
<section id="contact_form">
	<h3>Contact Form</h3><hr class="notop">
<p>
	Contact form is based on HTML 5 AJAX Contact Form from CodeCanyon (<a href="http://codecanyon.net/item/html-5-ajax-contact-form/122299">http://codecanyon.net/item/html-5-ajax-contact-form/122299</a>). You don&#39;t have to know PHP. To change email adress, open &quot;<strong>contact.php</strong>&quot;, find and edit code below:</p>
<pre>
// Configuration option.
// Enter the $email $address that you want to emails to be sent to.
// Example $address = &quot;&#106;&#111;&#101;&#46;&#100;&#111;&#101;&#64;&#121;&#111;&#117;&#114;&#100;&#111;&#109;&#97;&#105;&#110;&#46;&#99;&#111;&#109;&quot;;

$address = &quot;&#109;&#97;&#105;&#108;&#64;&#101;&#120;&#97;&#109;&#112;&#108;&#101;&#46;&#99;&#111;&#109;&quot;;
</pre>
<p>
	If you&#39;ll have any questions regarding to this form you can also contact with plugin author here: <a href="http://codecanyon.net/item/html-5-ajax-contact-form/discussion/122299">http://codecanyon.net/item/html-5-ajax-contact-form/discussion/122299</a></p>
<p>
	&nbsp;</p>
</section>
<section id="twitter_flickr">
	<h3>Twitter & Flickr</h3><hr class="notop">
<h5 id="twitter_flickr_twitter_script">
	<strong>Twitter Widget</strong></h5>
<p>
	To configure Twitter widget change sample to your twitter&#39;s nickname. You can also modify that how many tweets will be showing (edit <strong>count</strong>&#39;s attrubite from 3 to other value).</p>
<div class="container">
	<pre>
<code class="js plain">&lt;script type=</code><code class="js string">&quot;text/javascript&quot;</code><code class="js plain">&gt;</code>
<code class="js spaces">  </code><code class="js plain">jQuery(document).ready(</code><code class="js keyword">function</code><code class="js plain">($){</code>
<code class="js spaces">  </code><code class="js plain">$.getJSON(</code><code class="js string">&#39;<a href="http://api.twitter.com/1/statuses/user_timeline/sample-nickname.json?count=3&amp;callback=?">http://api.twitter.com/1/statuses/user_timeline/<em><strong>sample-nickname</strong></em>.json?count=3&amp;callback=?</a>&#39;</code><code class="js plain">, </code><code class="js keyword">function</code><code class="js plain">(tweets){</code>
<code class="js spaces">  </code><code class="js plain">$(</code><code class="js string">&quot;#twitter&quot;</code><code class="js plain">).html(tz_format_twitter(tweets));</code>
<code class="js spaces">  </code><code class="js plain">}); });</code>
<code class="js plain">&lt;/script&gt;</code>
</pre>
</div>
<p>
	<em>Code above is included in footer and blog widget.</em></p>
<h5 id="twitter_flickr_flickr">
	<strong>Flickr</strong></h5>
<p>
	Change current attrubition of <strong>user </strong>to your&#39;s ID (user=00000000@N00).</p>
<div class="container">
	<pre>
<code class="js plain">&lt;script type=</code><code class="js string">&quot;text/javascript&quot;</code> <code class="js plain">src=</code><code class="js string">&quot;<a href="http://www.flickr.com/badge_code_v2.gne?count=8&amp;amp;display=random&amp;amp;size=s&amp;amp;layout=x&amp;amp;source=user&amp;amp;user=52821721@N00">http://www.flickr.com/badge_code_v2.gne?count=8&amp;amp;display=random&amp;amp;size=s&amp;amp;layout=x&amp;amp;source=user&amp;amp;user=52821721@N00</a>&quot;</code><code class="js plain">&gt;</code>

</pre>
</div>
<p>
	&nbsp;</p>
</section>
<section id="javascript">
	<h3>JavaScript</h3><hr class="notop">
<p>
	<strong>You can see some help info, when click links which are below each regarding script:</strong></p>
<ol>
	<li>
		<strong>jQuery</strong> - is a Javascript library that greatly reduces the amount of code that you must write. For more information, please visit <a href="http://www.jquery.com/">http://www.jquery.com/</a></li>
	<li>
		<strong>Flexslider</strong> - Refer to the <a href="http://www.woothemes.com/flexslider/">author&#39;s documentation</a> for additional notes on how to use it.</li>
	<li>
		<strong>Isotope</strong> - Refer to the <a href="http://isotope.metafizzy.co/">author&#39;s documentation</a> for additional notes on how to use it.</li>
	<li>
		<strong>Fancybox</strong> - Refer to the <a href="http://fancyapps.com/fancybox/">author&#39;s documentation</a> for additional notes on how to use it.</li>
</ol>
</section>
<section id="sources_credits">
	<h3>Sources & Credits</h3><hr class="notop">
<p class="info">
	The images included in preview are for demonstration purposes and should always be replaced with your own work.</p>
<p class="info">
	Photos are bought from PhotoDune and if you want to buy one just contact me and I&#39;ll provide you a link.</p>
<hr>
<p>
	Once again, thank you so much for purchasing this theme. As I said at the beginning, I&#39;d be glad to help you if you have any questions relating to this theme. No guarantees, but I&#39;ll do my best to assist.</p>
<p>
	If you have a more general question relating to the themes on ThemeForest, basic HTML/CSS/JavaScript related questions, you might consider visiting the forums and asking your question in the &quot;Item Discussion&quot; section.</p>
<p>
	Regards,<br>
	<strong>Vasterad</strong></p>
</section>

	</div>
</body>
</html>